<!-- eslint-disable vue/multi-word-component-names -->
<template>
    <div class="box">
      <div class="top">设备维护记录表</div>
      <table>
        <tr style="background: #188d9f; height: 40px; border-bottom: 1px solid #a78d41; color: #f90; font-weight: bold; font-size: 16px">
          <th>厂区鸡舍</th>
          <th>设备名称</th>
          <th>设备编号</th>
          <th>维护内容</th>
          <th>维护人</th>
          <th>维护日期</th>
          <th>备注</th>
        </tr>
        <tr @click="gohenh" v-for="(item, index) in data" :key="index" style="border-bottom: 1px dashed #a78d41; color: #f90; height: 38px;">
          <th>{{ item.name }}</th>
          <th>{{ item.status }}</th>
          <th>{{ item.keep }}</th>
          <th>{{ item.wash }}</th>
          <th>{{ item.give }}</th>
          <th>{{ item.time }}</th>
          <th></th>
        </tr>
      </table>
    </div>
  </template>
  
  <script lang="ts" setup>
  const data = [
    {
      name:'XX厂区鸡舍1',
      status:"风机",
      keep:'001',
      wash:'清洁',
      give:'XXX',
      time: '2024/06/6'
    },
    {
      name:'XX厂区鸡舍2',
      status:"风机",
      keep:'002',
      wash:'清洁',
      give:'XX',
      time: '2024/06/6'
    },
    {
      name:'XX厂区鸡舍3',
      status:"风机",
      keep:'003',
      wash:'清洁',
      give:'XXX',
      time: '2024/06/6'
    },
  ]
  
  </script>
  
  <style scoped>
  .box {
      width: 90%;
      width: 100%;
  }
  
  .top {
      width: 100%;
      text-align: center;
      font-size: 28px;
      font-weight: bold;
      color: #2af7f6;
      padding-top: 1vh;
  }
  
  .box table {
    width: 80%;
    /* height: 16vh; */
    margin-left: 4vw;
    margin-top: 1vh;
    text-align: center;
    border-collapse: collapse;
    font-size: 14px;
    border: none;
  }
  
  </style>